<template>
  <div>
    <div class="head">
      <van-icon
        name="arrow-left"
        @click="fh"
        style="
          float: left;
          font-size: 20px;
          margin-left: 10px;
          margin-top: 10px;
        "
      />
      <h4>地址列表</h4>
    </div>

    <div class="main">
      <span class="hint">
        付款后<b>仅能修改一次</b>,
        修改后可能会影响物流时效。若修改地址失败，可联系客服手动修改。
      </span>
      <div class="main_1">
        <van-address-list
          v-model="chosenAddressId"
          :list="list"
          :disabled-list="disabledList"
          disabled-text="以下地址超出配送范围"
          default-tag-text="默认"
          @add="onAdd"
          @edit="onEdit"
        />
      </div>
    </div>

    <div class="foot">
      <button @click="onAdd">新增地址</button>
      <button class="but" @click="onEdit">确认修改</button>
    </div>
  </div>
</template>

<script>
import { addresses } from "@/api/Orde";
export default {
  data() {
    return {
      chosenAddressId: "1",
      list: [],
      disabledList: [
        {
          id: "3",
          name: "王五",
          tel: "1320000000",
          address: "浙江省杭州市滨江区江南大道 15 号",
        },
      ],
    };
  },
  methods: {
    onAdd() {
      // Toast("新增地址");
      this.$router.push("/Creation");
    },
    onEdit() {
      console.log(654);
      // Toast("编辑地址:" + index);
      this.$router.go(-1);
      // 确认修改
    },
    fh() {
      console.log(32);
      this.$router.go(-1);
      //返回上一页
    },
    add() {
      addresses({
        uid: 1,
      }).then((res) => {
        this.list = res.result;
        if (res.result.isDefault == "1") {
          this.result.isDefault = false;
        }
        console.log(this.list);
      });
    },
  },
  mounted() {
    this.add();
  },
};
</script>

<style scoped>
.head {
  width: 100%;
  height: 50px;
  background-color: rgb(255, 255, 255);
  /* margin-top: 10px; */
  line-height: 50px;
  /* display: flex; */
}

.head h4 {
  font-weight: 500;
  text-align: center;
  line-height: 50px;
  margin: 0;
  margin-right: 30px;
}
.van-address-list__bottom {
  display: none;
}

.main {
  /* height: 100vh; */
  background-color: rgb(240, 240, 240);
  padding: 10px;
}

.hint {
  font-size: 12px;
  /* background-color: wheat; */
}

.site {
  /* height: 100px; */
  margin-top: 20px;
  background-color: white;
  border-radius: 5px;
  padding: 15px;
}
.sites {
  width: 290px;
  font-size: 12px;
  margin-top: 10px;
  /* background-color: darkkhaki; */
}

.site_1 {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
}

.site_1 img {
  margin-top: 14px;
  margin-right: 5px;
  width: 20px;
  height: 20px;
}

.foot {
  width: 370px;
  position: fixed;
  bottom: 0px;
  box-sizing: border-box;
  padding: 5px 15px;
  display: flex;
  justify-content: space-between;
  width: 400px;
  /* height: 40px; */
  /* left: 45px; */
  background-color: white;
}
.foot button:nth-child(1) {
  height: 35px;
  background-color: white;
  color: red;
  border: 1px solid red;
  width: 180px;
  border-radius: 50px;
}
.foot button:nth-child(2) {
  height: 35px;
  border: 0;
  color: white;
  border-radius: 50px;
  background-color: rgb(255, 50, 50);
  width: 180px;
}
</style>